<template>
  <baidu-map class="map"
    :center="{lng:121.6292529148,lat:31.2035397816}"
    :zoom='13'
    :scroll-wheel-zoom='true'
    @click="getInfo"
    >
      <bm-marker :position="{lng: lng, lat: lat}" :dragging="true" animation="BMAP_ANIMATION_BOUNCE">
      </bm-marker>
    </baidu-map>
</template>

<script>
export default {
  name: 'Map',
  data () {
    return {
      lng: '',
      lat:''
    }
  },
  mounted () {
  },
  methods: {
    getInfo (e) {
      console.log(e)
      this.$set(this, 'lng', e.point.lng)
      this.$set(this, 'lat', e.point.lat)
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.map {
  width: 100%;
  height: 100%;
}

</style>
